/* eslint-disable-next-line */
import axios from 'axios'
export default {
  data () {
    return {
      userList: [
        {
          username: '王小虎',
          email: 'xxx.com',
          mobile: 12343212345
        }
      ],
      //  总个数
      total: 0,
      pagenum: 1,
      // state: true,
      input5: '',
      // 显示添加用户对话框
      dialogAddUserVisible: false,
      dialogEditUserVisible: false,
      // 添加用户对象
      addUserForm: {
        username: '',
        password: '',
        email: '',
        mobile: ''
      },

      rules: {
        username: [
          // 如果不写内容会 触发
          { required: true, message: '请输入用户名', trigger: 'blur' },
          // 如果格式不正确会触发
          { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
        ],
        password: [
          // 如果不写内容会 触发
          { required: true, message: '请输入密码', trigger: 'blur' },
          // 如果格式不正确会触发
          { min: 5, max: 10, message: '长度在 5 到 10 个字符', trigger: 'blur' }
        ]
      },
      // 编辑用户对象
      editUserForm: {
        username: 'xxx',
        email: '',
        mobile: ''
      }
    }
  },
  created () {
    this.loadUserList()
  },
  methods: {
    // 加载用户数据列表
    async loadUserList (pagenum = 1, query = '') {
      // let res = await axios.get('http://localhost:8888/api/private/v1/users', {
      //   params: {
      //     query,
      //     pagenum,
      //     pagesize: 2
      //   },
      //   headers: {
      //     Authorization: localStorage.getItem('token')
      //   }
      // })
      let res = await this.$axios.get('users', {
        params: {
          query,
          pagenum,
          pagesize: 2
        }
      })
      console.log(res)

      // .then(res => {
      console.log(res)
      this.userList = res.data.data.users
      this.total = res.data.data.total
      this.pagenum = res.data.data.pagenum
      // })
    },
    // 点击页面
    pageChange (curPage) {
      console.log(curPage)
      this.loadUserList(curPage, this.input5)
    },
    // 查询内容
    startQuery () {
      this.loadUserList(1, this.input5)
    },
    async delUser (id) {
      try {
        await this.$confirm('此操作将永久删除该用户, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
        let res = await this.$axios.delete(`users/${id}`)
        console.log(res)
        // console.log('删除成功')

        // 重载列表
        if (res.data.meta.status === 200) {
          this.loadUserList(1)
          // 提示删除成功
          this.$message({
            message: '删除成功',
            type: 'success'
          })
        }
      } catch (error) {
        console.log('取消删除')

        this.$message({
          type: 'info',
          message: '已取消删除',
          duration: 800
        })
      }
    },
    showAddUserDialog () {
      this.dialogAddUserVisible = true
    },

    // 添加用户

    async addUser () {
      let res = await this.$axios.post('users', this.addUserForm)
      console.log(res)
      if (res.data.meta.status === 201) {
        this.dialogAddUserVisible = false

        this.loadUserList(1)

        this.$message({
          message: '添加用户成功',
          type: 'success'
        })
      }
    },
    // 改变用户状态
    async stateChange (row) {
      console.log(row)
      let id = row.id
      let mgState = row.mg_state
      // 用户状态改变了
      console.log('改变了')

      let res = await this.$axios.put(`users/${id}/state/${mgState}`)
      console.log(res)

      // 刷新列表
      this.loadUserList(1)

      // 提示修改状态成功
      this.$message({
        message: '修改状态成功',
        type: 'success'
      })
    },

    // 显示编辑用户对话框

    editUserShow (row) {
      console.log(row)
      const { username, mobile, email, id } = row
      this.editUserForm.username = username
      this.editUserForm.mobile = mobile
      this.editUserForm.email = email
      this.editUserForm.id = id
      this.dialogEditUserVisible = true
    },
    async editUser () {
      const { id, email, mobile } = this.editUserForm
      let res = await this.$axios.put(`users/${id}`, {
        email,
        mobile
      })
      console.log(res)
      if (res.data.meta.status === 200) {
        console.log(123)

        // 隐藏对话框
        this.dialogEditUserVisible = false
        // 刷新页面
        this.loadUserList(1)
        // 提示修改、更新成功
        this.$message({
          message: res.data.meta.msg,
          type: 'success'
        })
      }
    }
  }
}
